import React from "react";

interface Props {
  todos: ITodoItem[];
}

class TodoOpt extends React.Component<Props> {
  render(): React.ReactNode {
    // 一个组件的 render 函数触发的时机
    //    1. 初始化触发一次
    //    2. setState  props 变化时

    const len = this.props.todos.filter((item) => item.isOk).length;

    return (
      <div>
        <p>当前勾选的数据条数： {len}</p>
      </div>
    );
  }
}

export default TodoOpt;
